// 车均充电电量
export function chargeAmount(data) {
  let colorMap = {
    "充电开始电量": "#FF9529",
    "充电结束电量": "#31D495"
  }
  let pieData = [{ value: data.value }]
  let rate = data.value / data.total * 100+ '%';
  let option = {
      title: [
          {
            text: data.label,
            x: 'center',
            top: '55%',
            textStyle: {
              fontSize: 10,
              fontWeight: '100'
            }
          },
          {
            text: rate,
            x: 'center',
            y: 'center',
            textStyle: {
              fontSize: 20
            }
          }
      ],
      polar: {
        radius: ['72%', '92%'],
        center: ['50%', '50%']
      },
      angleAxis: {
          max: 100,
          show: false
      },
      radiusAxis: {
          type: 'category',
          show: true,
          axisLabel: {
            show: false
          },
          axisLine: {
            show: false
          },
          axisTick: {
            show: false
          }
      },
      series: [
          {
            type: 'bar',
            roundCap: true,
            barWidth: 30,
            showBackground: true,
            backgroundStyle: {
              color: '#F0F0F1'
            },
            data: pieData,
            coordinateSystem: 'polar',
            itemStyle: {
              color: colorMap[data.label]
            }
          }
      ]
  };
	return option;
}

// 充电时段
export function chargeTimes(data) {
  const { list } = data
  let option = {
    tooltip: {
      show: false,
      trigger: 'item'
    },
    legend: {
      top: '5%',
      right: 0,
      orient: 'vertical',
      icon: 'circle',
      formatter: (name) => {
        let item = list.filter(o => o.name === name)[0]
        return `{name|${name}}{value| ${item.value}h}`;
      },
      textStyle: {
        rich: {
          name: {
            width: 120
          },
          value: {
            width: 20,
            align: "right",
            fontWeight: "bold"
          }
        }
      }
    },
    series: [
      {
        type: 'pie',
        radius: ['60%', '80%'],
        center: ['20%', '50%'],
        color: ['#9176FF', '#00D3FF', '#4A80FF'],
        label: {
          show: true,
          position: 'center',
          fontSize: 10,
          formatter: (data) => {
            return data.percent + '%' + '\n' + data.name
          }
        },
        emphasis: {
          label: {
            show: true,
            fontSize: 14,
            fontWeight: 'bold'
          }
        },
        labelLine: {
          show: false
        },
        itemStyle: {
          borderWidth: 2,
          borderColor: '#fff',
          borderRadius: 5
        },
        data: list
      }
    ]
  };
  return option
}

// 运营趋势
export function operationTrend(data) {
  let xData = [], yMileData = [], yRateData = [], arrY = []
  data?.mile?.forEach(o => {
    xData.push(o.label)
    arrY.push(o.value)
  })
  let maxVal = Math.max(...arrY);
  arrY.forEach((o, i) => {
    yMileData.push({
      value: o,
      itemStyle: {
        opacity: o / maxVal * 0.7
      }
    })
    if (i === 0) {
      yMileData[0].itemStyle.color = '#ccc'
    }
  })
  data?.rate?.forEach(o => {
    yRateData.push(o.value)
  })
  let option = {
    tooltip: {
      trigger: 'axis',
      backgroundColor: "#1A205E",
      textStyle: {
        color: "#fff"
      }
    },
    legend: {
      show: false,
      data: ['每日总运营率', '每日总里程']
    },
    grid: {
      bottom: 20,
      right: 0,
      left: 20,
      containLabel: true
    },
    xAxis: {
      type: 'category',
      data: xData
    },
    yAxis: [
      {
        type: 'value'
      },
      {
        type: 'value',
        axisLabel: {
          formatter: '{value} %'
        }
      }
    ],
    series: [
      {
        name: '每日总里程',
        type: 'bar',
        data: yMileData,
        itemStyle: {
          color: '#4A80FF'
        },
        label: {
          show: true,
          position: 'insideBottom',
          color: '#4A80FF',
          opacity: 1
        }
      },
      {
        name: '每日总运营率',
        type: 'line',
        itemStyle: {
          color: '#31D495'
        },
        yAxisIndex: 1,
        data: yRateData,
        label: {
          show: true,
          formatter: (data) => {
            return data.value + '%'
          }
        }
      }
    ]
  };
	return option;
}
